Component({
  properties: {
    problem: Object,
    replyList: Array
  },

  data: {
    formattedComments: []
  },

  lifetimes: {
    attached() {
      this.formatComments();
    }
  },

  methods: {
    formatComments() {
      const formattedComments = this.properties.replyList.map(comment => ({
        ...comment,
        replies: this.flattenReplies(comment)
      }));
      this.setData({ formattedComments });
    },

    flattenReplies(comment, parentChain = []) {
      let replies = [];
      if (comment.replyList && comment.replyList.length > 0) {
        for (let reply of comment.replyList) {
          replies.push({
            ...reply,
            parentChain: [...parentChain, comment.rid]
          });
          replies = replies.concat(this.flattenReplies(reply, [...parentChain, comment.rid, reply.rid]));
        }
      }
      return replies;
    }
  }
});